<script lang="ts">
  import CustomerCaseLink from '$lib/CustomerCaseLinkAtSolution.svelte';
  import { product } from '$store/product';
</script>
<slot />
<div class="mx-auto mt-16 w-full h-[475px] bg-[#f9f9f9]">
	<div class="pt-12 text-center text-[32px]">这些品牌都在用</div>
	<div class="mx-auto w-[1200px] h-[206px] pt-[44px]">
		<CustomerCaseLink product="{$product.name}" />
	</div>
	<div class="pt-14 flex justify-center text-2xl">
		<a
			class="rounded-[37.5px] px-4 py-2 flex justify-center items-center border-solid border border-primary bg-white text-primary w-[206px] h-16"
			href="void:(0)">查看更多案例</a
		>
	</div>
</div>

<style global lang="scss">
	.solution-part {
		@apply mx-auto mt-16 w-[1259px] grid grid-cols-2;
		.solution-part-title {
			@apply pb-4 text-[32px] font-semibold;
		}
		.solution-part-sub-title {
			@apply text-[#666666] text-lg leading-[38px] w-[478px];
		}
	}
</style>
